<?php echo $this->doctype() ?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>toto</title>
  <?php echo $this->headLink()->appendStylesheet('public/css/rencontre.css') ?>
  <style>
  @charset "utf-8";
/* CSS Document by Dieter Schneider | CssTemplateHeaven.com */
/* Reset Styles (Credits to Eric Meyer: http://meyerweb.com/eric/tools/css/reset/) */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* end reset */
html {background: #f7f7f7; font-size: 100%}
/*------------------ Site Structure ------------------*/
body {width: 960px; margin: auto; font-family: Georgia, "Times New Roman", Times, serif; font-size: .875em; color: #666}
#header {height: 160px; background: url(images/logo.png) no-repeat}
#content {
	width: 620px;
	float: left;
	margin-bottom: 44px;
}
#sidebar {
	width: 260px; 
	padding: 20px;
	float: right;
	border: 1px solid #dcdcdc;
	margin-bottom: 44px
}
#sidebar h3, .sidebar_box {
	background: #eaeaea; 
	padding: 5px 10px; 
	margin-bottom: 15px;
	border: 1px solid #FFF;
	outline:1px solid #dcdcdc;
}
/* sidebar menu */
.navcontainer { width: 280px; margin-bottom: 25px }
.navcontainer ul{
	margin-left: 0;
	padding-left: 0;
	list-style-type: none;
}
.navcontainer a {
	display: block;
	padding: 10px 10px;
	width: 240px;
	background: url(images/seperator.png) repeat-x bottom;
}
.navcontainer a:link, .navlist a:visited {
	text-decoration: none;
}
.navcontainer a:hover{
	color: #000;
}
/* end sidebar menu */
#intro {
	border: 1px solid #FFF; 
	clear: both;
	padding: 20px;
	font-size: 1.4em; 
	line-height: 1.6em; 
	margin-bottom: 44px;
	outline:1px solid #dcdcdc;
	background: #eaeaea
}
#intro span {font-weight: 700}
#intro p {padding: 0}
#box_left {width: 300px; float: left; margin-bottom: 44px; text-align: justify}
#box_right {width: 300px; float: right; margin-bottom: 44px; text-align: justify}
#box_middle {margin-left: 330px; margin-right: 330px; margin-bottom: 44px; text-align: justify}
#box_left h3, #box_right h3, #box_middle h3 {
	background: #eaeaea;
	font-weight: normal;
	margin-bottom: 25px;
	position: relative;
	text-transform: uppercase;
	letter-spacing: .08em;
	font-size: 1.4em;
	padding: 8px 15px;
	border: 1px solid #FFF;
	outline:1px solid #dcdcdc;
}

#footer {clear: both; padding: 10px; text-align: right; background: url(images/seperator.png) repeat-x top; font-size: .8em; color: #a3a3a3}
/*------------------ typography and images ------------------*/
/* global links */
a {text-decoration: none; color: #740000}
/* text styles */
h1 {font-size: 2em; font-weight: normal; padding-bottom: 10px}
h2 {font-size: 1.6em; font-weight: normal; padding-bottom: 6px}
h3, h4 {font-size: 1.4em; font-weight: normal}
h5, h6  {font-size: 1.2em}
p {line-height: 1.4em; padding-bottom: 25px}
/* images */
.more {float: right; margin-right: 10px}
/*------------------ gallery ------------------*/
#gallery {
	
	overflow: auto;
	margin-left: -44px;
	padding-bottom: 18px;
	position:static;
}
#gallery ul li {
	width: 190px;
	height: 215px;
	padding-top: 17px;
	padding-left: 17px;
	float: left;
	background: url(images/thumb_bg.png) no-repeat;
	margin-left: 44px;
	margin-bottom: 28px;
}
.center {margin: auto;}
#no_gallery_found {width: 798; padding: 50px; margin: auto; background: red; border: 10px solid white}
/*-----------------------------------------------*/
/*---------------    feeling-menu    ---------------*/
/*---------------------------------------------*/
/* 
	LEVEL ONE
*/
ul.feeling-menu                         { position: relative; z-index:10; margin: auto; border-top: 1px solid #dbdbdb;
	                                  border-bottom: 1px solid #dbdbdb; height:36px; background: #eaeaea; margin-bottom: 44px}									  
ul.feeling-menu li                      { float: left; zoom: 1;  }
ul.feeling-menu a:hover		            { color: ; }
ul.feeling-menu a:active                { color: ; }
ul.feeling-menu li a                    { display: block; padding: 9px 20px;
	 								  color: #222; }
ul.feeling-menu li:last-child a         { border-right: none; } /* Doesn't work in IE */
ul.feeling-menu li.hover,
ul.feeling-menu li:hover                { color: #666; position: relative; }
ul.feeling-menu li.hover a              { color: #666; }
/* 
	LEVEL TWO
*/
ul.feeling-menu ul 						{ width: 220px; visibil ity: hidden; position: absolute; top: 100%; left: 0; background: #eaeaea;
                                           border-left: 1px solid #dbdbdb; border-right: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb}
ul.feeling-menu ul li 					{ font-weight: normal; background: url(images/feeling-menu.png);  color: #000; 
									  border-bottom: 1px solid #dbdbdb; float: none; }							  
                                    /* IE 6 & 7 Needs Inline Block */
ul.feeling-menu ul li a					{ border-right: none; background: none; padding: 9px 8px; width: 100%; display: inline-block; } 
/* 
	LEVEL THREE
*/
ul.feeling-menu ul ul 					{ left: 100%; top: 0; z-index:300; border-top: 1px solid #dbdbdb }
ul.feeling-menu li:hover > ul 			{ visibility: visible; }
  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
	<script>
		$(function() {
			$("li").click(function(e) {
			  e.preventDefault();
			  $("li").removeClass("selected");
			  $(this).addClass("selected");
			});
		});
	</script>
</head>
<body>
  <a href="celibataire/logout">se deconnecter</a>
	<ul class="feeling-menu">
	    <li class="selected"><a href="/">Acceuil</a></li>
	    <li><a href="#">Derniers inscrits</a></li>
	    <li ><a href="#">Feeling</a></li>
	    <li><a href="#">Visiter</a></li>
	    <li><a href="#">Bloquer</a></li>
	    <li><a href="#">Recherche</a></li>
	    <li><a href="#">Charme</a></li>
	    <li><a href="#">Messages</a></li>
	</ul>
<?php echo $this->layout()->content ?>
<div id="gallery"><!-- gallery -->

<ul>
  <li><a href="gallery.html"><img src="images/thumb.jpg" alt="demo" /></a></li>
  <li><a href="gallery.html"><img src="images/thumb.jpg" alt="demo" /></a></li>
  <li><a href="gallery.html"><img src="images/thumb.jpg" alt="demo" /></a></li>
  <li><a href="gallery.html"><img src="images/thumb.jpg" alt="demo" /></a></li>                        
</ul>

</div><!-- close gallery -->
 
 
<div id="intro">
<p><span>Welcome to my site.</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris quis risus ligula. Proin rhoncus felis at ipsum consequat eget commodo libero semper. Morbi sed purus arcu.</p>
</div>


<div id="box_left">
<h3>About</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor hendrerit lacus egestas sollicitudin. Nullam pharetra commodo sem, sit amet mattis metus vestibulum at. Suspendisse in tellus metus. Ut lobortis gravida magna, et mollis nisl luctus et. Ut quis neque eros</p>
<a href="page.html"><img src="images/more.png" class="more" width="68" height="24" alt="more" /></a>
</div>

<div id="box_right">
<h3>Recent</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor hendrerit lacus egestas sollicitudin. Nullam pharetra commodo sem, sit amet mattis metus vestibulum at. Suspendisse in tellus metus. Ut lobortis gravida magna, et mollis nisl luctus et. Ut quis neque eros</p>
<a href="page.html"><img src="images/more.png" class="more" width="68" height="24" alt="more" /></a>
</div>

<div id="box_middle">
<h3>Services</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor hendrerit lacus egestas sollicitudin. Nullam pharetra commodo sem, sit amet mattis metus vestibulum at. Suspendisse in tellus metus. Ut lobortis gravida magna, et mollis nisl luctus et. Ut quis neque eros</p>
<a href="page.html"><img src="images/more.png" class="more" width="68" height="24" alt="more" /></a>
</div>

<div id="footer">
Exclusively on <a href="http://www.sixrevisions.com">Six Revisions</a> | Created by <a href="http://www.csstemplateheaven.com">CssTemplateHeaven</a>
</div>

</body>
</html>
